<template>
  <div class="info">
    <van-notice-bar v-if="tips" wrapable :scrollable="false" :text="tips" />
    <div class="wrap">
      <van-cell-group class="group">
        <MainTitle text="入院登记信息" />

        <!-- 0:取消，1-确认,2-待确认，3-未安排床位 -->
        <van-tag v-if="isConfirm == 2" type="primary" class="tag" color="#ffa259" size="medium"
          >待确认</van-tag
        >
        <van-tag v-if="isConfirm == 1" type="primary" class="tag" color="#40BB90" size="medium"
          >预留成功</van-tag
        >
        <van-tag v-if="isConfirm === 0" type="primary" class="tag" color="#FF2D69" size="medium"
          >已取消</van-tag
        >
        <van-tag v-if="isConfirm == 3" type="primary" class="tag" color="#FF2D69" size="medium"
          >未安排床位</van-tag
        >

        <van-cell title="办理入院时间" :value="nurseAdmiNote.handleInHospitalTime || '-'" />
        <van-cell title="床位号" :value="nurseAdmiNote.bedNo || '-'" />

        <van-cell title="住院号" :value="docAdmiNote.admissionNum || '-'" />
        <van-cell title="患者姓名" :value="docAdmiNote.patName || '-'" />
        <van-cell title="性别" :value="docAdmiNote.patSex || '-'" />
        <van-cell title="身份证号" :value="docAdmiNote.patIdNo || '-'" />
        <van-cell title="出生日期" :value="docAdmiNote.dateOfBirth || '-'" />
        <van-cell title="收治科室" :value="docAdmiNote.admissionDeptName || '-'" />
        <van-cell title="住院按金" :value="docAdmiNote.admMoney || '-'" />
        <van-cell title="入院情况" :value="docAdmiNote.patAdmCondition || '-'" />
        <van-cell title="入院途径" :value="docAdmiNote.patientClass || '-'" />
        <van-cell title="入院方式" :value="docAdmiNote.admissionWay || '-'" />
        <van-cell title="门（急）诊诊断" :value="docAdmiNote.diagDesc || '-'" />
      </van-cell-group>
      <van-cell-group>
        <MainTitle text="个人信息" />
        <van-cell title="国籍" :value="patAdmiNote.nationality?.name || '-'" />
        <van-cell title="民族" :value="patAdmiNote.nation?.name || '-'" />
        <van-cell title="手机号" :value="patAdmiNote.phoneNo || '-'" />
        <van-cell title="婚姻状况" :value="patAdmiNote.marriage?.name || '-'" />
        <van-cell title="职业" :value="patAdmiNote.profession?.name || '-'" />
      </van-cell-group>
      <van-cell-group>
        <MainTitle text="地址信息" />
        <van-cell title="户口地址" :label="patAdmiNote.register || '-'" />
        <van-cell title="现住地址" :label="patAdmiNote.residence?.name || '-'" />
        <van-cell title="工作单位地址" :label="patAdmiNote.workAddress || '-'" />
        <van-cell
          title="出生地"
          :value="
            patAdmiNote.birthProv?.name +
              patAdmiNote.birthCity?.name +
              patAdmiNote.birthCounty?.name || '-'
          "
        />
        <van-cell title="籍贯" :value="patAdmiNote.nativePlace?.name || '-'" />
      </van-cell-group>
      <van-cell-group>
        <MainTitle text="家属信息" />
        <van-cell title="联系人姓名" :value="patAdmiNote.contactName || '-'" />
        <van-cell title="关系" :value="patAdmiNote.relation?.name || '-'" />
        <van-cell title="联系人电话" :value="patAdmiNote.contactPhone || '-'" />
        <van-cell title="联系人地址" :label="patAdmiNote.contactAddress || '-'" />
      </van-cell-group>
    </div>
    <div style="padding: 32px 15px">
      <van-button
        v-if="isConfirm == 2"
        class="btn"
        style="position: fixed; bottom: 10px; width: 90%"
        color="#40BB90"
        type="primary"
        block
        @click="save"
        >确认保留床位</van-button
      >
    </div>
  </div>
</template>

<script lang="ts" setup>
import { IgetDetailByNoticeSerialNo } from '@/typings/getDetailByNoticeSerialNo';
import { commonTypes } from '@/typings/commonTypes';
import { IqueryDictionaries } from '@/typings/queryDictionaries';

import {
  updateOntimeInHospitalStateRequestDTO,
  getDetailByNoticeSerialNo,
} from '@/services/inHospitalApi';
import { useTo } from '@/utils/useTo';

import { Cell, CellGroup, Dialog, NoticeBar, Toast, Tag } from 'vant';
import MainTitle from '@/components/MainTitle.vue';

//因为这里用了script的setup方式就用不到 defineComponent 这个定义组件的api了
import {
  useSlots,
  useAttrs,
  defineProps,
  computed,
  onMounted,
  watchEffect,
  ref,
  reactive,
} from 'vue';

import { useStore } from 'vuex';
const store = useStore<commonTypes.IState>();

// 跳路由用
import router from '@/router/index';
// 获取路由参数
import { useRoute } from 'vue-router';
const route = useRoute();
// const slots = useSlots();
// const attrs = useAttrs();

//import HelloWorld from '@/components/HelloWorld.vue'; // @ is an alias to /src

const isConfirm = ref();
const tips = ref();

const docAdmiNote = ref({} as IgetDetailByNoticeSerialNo.DocAdmiNote);
const nurseAdmiNote = ref({} as IgetDetailByNoticeSerialNo.NurseAdmiNote);
const patAdmiNote = ref({} as IgetDetailByNoticeSerialNo.PatAdmiNote);

const getDetailByNoticeSerialNoFn = async () => {
  const toast = Toast.loading({
    overlay: true,
    duration: 0,
  });
  const [err, res] = await useTo(getDetailByNoticeSerialNo(route.query.noticeSerialNo ?? null));
  toast.clear();
  if (err) return Toast(err.errorMsg);
  let obj: IgetDetailByNoticeSerialNo.BusObj = res.busObj.busObj;

  isConfirm.value = res.busObj.isConfirm;
  tips.value = res.busObj.tips;
  store.dispatch('IsConfirmAction', res.busObj.isConfirm);
  store.dispatch('formAction', obj);

  docAdmiNote.value = obj.docAdmiNote as IgetDetailByNoticeSerialNo.DocAdmiNote;
  nurseAdmiNote.value = obj.nurseAdmiNote as IgetDetailByNoticeSerialNo.NurseAdmiNote;
  patAdmiNote.value = obj.patAdmiNote as IgetDetailByNoticeSerialNo.PatAdmiNote;

  console.log('详情：', obj);
};

//更新按时入院状态
const updateOntimeInHospitalStateRequestDTOFn = async (isConfirm: string) => {
  const toast = Toast.loading({
    overlay: true,
    duration: 0,
  });
  let pam = {
    hospitalUUID: store.state.hospitalUUID,
    noticeSerialNo: route.query.noticeSerialNo ?? null,
    isConfirm: isConfirm, //是否确认0:取消，1-确认
  };
  const [err, res] = await useTo(updateOntimeInHospitalStateRequestDTO(pam));
  toast.clear();
  if (err) return Toast(err.errorMsg);
  Toast(res.errorMsg);
  if (isConfirm == '1') {
    tk();
  } else {
    location.reload();
  }
};

const tk = () => {
  Dialog.alert({
    message: '已成功为您预留床位。请按约定时间到院办理入院手续！',
    confirmButtonColor: '#40BB90',
  }).then(() => {
    location.reload();
  });
};

const save = () => {
  Dialog.confirm({
    title: '温馨提示',
    message: '您是否确认保留床位?',
  })
    .then(() => {
      updateOntimeInHospitalStateRequestDTOFn('1');
    })
    .catch(() => {
      updateOntimeInHospitalStateRequestDTOFn('0');
    });
};

onMounted(() => {
  //console.log('onMounted:', process.env.NODE_ENV);

  getDetailByNoticeSerialNoFn();
  // mock();
});

//watchEffect 会最先执行
watchEffect(() => {
  //console.log('watchEffect:', 3333);
});
</script>

<style lang="scss">
.info {
  .van-cell__value,
  .van-cell__label {
    font-size: 16px !important;
    color: #333333 !important;
  }

  .wrap {
    .group {
      position: relative;
    }
    .tag {
      position: absolute;
      right: 16px;
      top: 15px;
    }
    .btn {
      color: white;
      background: rgb(64, 187, 144);
      border-color: rgb(64, 187, 144);
      height: 40px;
      position: fixed !important;
      bottom: 9px !important;
      width: 90%;
    }
  }
}
</style>
